<script type="text/html" id="invoice">
    <div class="overlayer-default" v-show="show">
        <div class="hd">
            <div class="weui-cells__title">填写发票信息</div>
            <div class="weui-cells">
                <div class="weui-cell weui-cell_access" @click="pickInvoiceType()">
                    <div class="weui-cell__hd">发票类型</div>
                    <div class="weui-cell__bd"></div>
                    <div class="weui-cell__ft">@{{ invoice.invoice_type == 1 ? '普通发票' : '增值税发票' }}</div>
                </div>
                <div class="weui-cell weui-cell_access" @click="pickTitleType()">
                    <div class="weui-cell__hd">抬头类型</div>
                    <div class="weui-cell__bd"></div>
                    <div class="weui-cell__ft">@{{ invoice.title_type == 1 ? '个人' : '企业' }}</div>
                </div>
                <div class="weui-cell">
                    <div class="weui-cell__hd" style="width: 100px;">@{{ invoice.title_type==1 ? '姓名' : '公司名称' }}</div>
                    <div class="weui-cell__bd">
                        <input type="text" class="weui-input" placeholder="" v-model="invoice.title">
                    </div>
                </div>
                <div class="weui-cell">
                    <div class="weui-cell__hd" style="width: 100px;">@{{ invoice.title_type==1 ? '身份证号码' : '纳税人识别号' }}</div>
                    <div class="weui-cell__bd">
                        <input type="text" class="weui-input" placeholder="" v-model="invoice.tax_no">
                    </div>
                </div>
                <div class="weui-cell">
                    <div class="weui-cell__bd">
                        <textarea class="weui-textarea" placeholder="发票备注信息" v-model="invoice.remark"></textarea>
                    </div>
                </div>
            </div>
            <div class="weui-btn-area">
                <div class="weui-btn weui-btn_primary" @click="confirm()">提交</div>
            </div>
            <div class="weui-btn-area">
                <div class="weui-btn weui-btn_default" @click="cancel()">取消</div>
            </div>
        </div>
    </div>
</script>
<script type="text/javascript">
    Vue.component('invoice',{
        template:'#invoice',
        data:function () {
            return {
                invoice:{
                    invoice_type:1,
                    title_type:1,
                    title:'',
                    tax_no:'',
                    remark:''
                },
                show:true
            }
        },
        props:{

        },
        methods:{
            confirm:function () {
                var invoice = this.invoice;
                if (!invoice.title)
                {
                    if (invoice.title_type == 1)
                    {
                        weui.topTips('请输入姓名');
                    } else {
                        weui.topTips('请输入公司名称');
                    }
                    return false;
                }

                if (!invoice.tax_no)
                {
                    if (invoice.title_type == 1)
                    {
                        weui.topTips('请输入身份证号码');
                    } else {
                        weui.topTips('请输入纳税人识别号');
                    }
                    return false;
                }
                this.$emit('confirm', this.invoice);
            },
            cancel:function(){
                this.$emit('cancel');
            },
            pickInvoiceType:function () {
                var $this = this;
                weui.picker([
                    {
                        label:'普通发票',
                        value:1
                    },
                    {
                        label:'增值税发票',
                        value:2
                    }
                ],{
                    onConfirm:function (result) {
                        $this.invoice.invoice_type = result[0].value;
                    },
                    defaultValue:[1]
                });
            },
            pickTitleType:function () {
                var $this = this;
                weui.picker([
                    {
                        label:'个人',
                        value:1
                    },
                    {
                        label:'公司',
                        value:2
                    }
                ],{
                    onConfirm:function (result) {
                        $this.invoice.title_type = result[0].value;
                    },
                    defaultValue:[1]
                });
            }
        }
    });
</script>
